<template>
  <div class="aui-card--fill scroll-box card-box">
    <div class="mod-sys__menu pane-shell">
      <el-form :inline="true"
               @submit.native.prevent
               :model="dataForm"
               class="align-right"
               @keyup.enter.native="search">
      </el-form>
      <el-table v-loading="dataListLoading"
                :data="dataList"
                border
                @selection-change="dataListSelectionChangeHandle"
                @sort-change="dataListSortChangeHandle"
                style="width: 100%;">
        <el-table-column type="index"
                         label="序号"
                         header-align="center"
                         align="center"
                         width="50">
        </el-table-column>
        <el-table-column prop="sonName"
                         label="系统模块"
                         show-overflow-tooltip
                         header-align="center"
                         align="center"
                         min-width="150">
          <template slot-scope="scope">
            <span v-if="scope.row.sonName === '0'">会务管理系统</span>
            <span v-if="scope.row.sonName === '1'">访客管理系统</span>
            <span v-if="scope.row.sonName === '2'">车辆管理系统</span>
            <span v-if="scope.row.sonName === '3'">宿舍管理系统</span>
            <span v-if="scope.row.sonName === '4'">门禁管理系统</span>
            <span v-if="scope.row.sonName === '5'">健身房管理系统</span>
            <span v-if="scope.row.sonName === '6'">物流车管理系统</span>
            <span v-if="scope.row.sonName === '7'">登录系统</span>
            <span v-if="scope.row.sonName === '8'">App管理系统</span>
          </template>
        </el-table-column>
        <el-table-column prop="moudleName"
                         label="触发模块"
                         show-overflow-tooltip
                         header-align="center"
                         align="center"
                         min-width="150">
          <template slot-scope="scope">
            <span v-if="scope.row.moudleName === '0'">会议室预约</span>
            <span v-if="scope.row.moudleName === '1'">访客申请</span>
            <span v-if="scope.row.moudleName === '2'">用车申请</span>
            <span v-if="scope.row.moudleName === '3'">物流车来访申请</span>
            <span v-if="scope.row.moudleName === '4'">员工入住申请</span>
            <span v-if="scope.row.moudleName === '5'">员工调宿申请</span>
            <span v-if="scope.row.moudleName === '6'">临时入住登记</span>
            <span v-if="scope.row.moudleName === '7'">门禁申请</span>
            <span v-if="scope.row.moudleName === '8'">健身房申请</span>
            <span v-if="scope.row.moudleName === '9'">物流车申请</span>
            <span v-if="scope.row.moudleName === '11'">验证码</span>
            <span v-if="scope.row.moudleName === '12'">通知公告</span>
          </template>
        </el-table-column>
        <el-table-column prop="state"
                         label="说明"
                         header-align="center"
                         align="center"
                         min-width="150"
                         show-overflow-tooltip>
        </el-table-column>
        <el-table-column prop="manufacturers"
                         label="厂家"
                         header-align="center"
                         min-width="120"
                         align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.manufacturers === 0">北森</span>
            <span v-if="scope.row.manufacturers === 1">泛微</span>
            <span v-if="scope.row.manufacturers === 2">企业微信</span>
            <span v-if="scope.row.manufacturers === 3">大华</span>
            <span v-if="scope.row.manufacturers === 4">海康</span>
            <span v-if="scope.row.manufacturers === 5">阿里云</span>
          </template>
        </el-table-column>
        <el-table-column prop="platformName"
                         label="平台名称"
                         header-align="center"
                         min-width="150"
                         align="center">
        </el-table-column>
        <el-table-column prop="switching"
                         label="开关"
                         show-overflow-tooltip
                         header-align="center"
                         align="center"
                         width="80">
          <template slot-scope="scope">
            <span v-if="scope.row.switching === 0">关</span>
            <span v-if="scope.row.switching === 1">开</span>
          </template>
        </el-table-column>
        <el-table-column prop="templateId"
                         label="短信模板ID"
                         header-align="center"
                         align="center"
                         min-width="150"
                         :show-overflow-tooltip="true">
        </el-table-column>
        <el-table-column prop="signName"
                         label="签名"
                         header-align="center"
                         align="center"
                         min-width="150"
                         show-overflow-tooltip>
        </el-table-column>
        <el-table-column :label="$t('handle')"
                         fixed="right"
                         header-align="center"
                         align="center"
                         width="100">
          <template slot-scope="scope">
            <el-button type="text"
                       size="small"
                       @click="edit(scope.row)">修改</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination :current-page="page"
                     :page-sizes="[10, 20, 50, 100]"
                     :total="total"
                     layout="total, sizes, prev, pager, next"
                     @size-change="pageSizeChangeHandle"
                     @current-change="pageCurrentChangeHandle">
      </el-pagination>
    </div>
    <set-update ref="addOrUpdate"
                @callBack="getDataList" />
  </div>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import formValidate from '@/mixins/form-validate'
import tableTemplate from '@/components/table-template'
import SetUpdate from './set-update.vue'
export default {
  mixins: [mixinViewModule, formValidate],
  data () {
    return {
      mixinViewModuleOptions: {
        getDataListURL: '/tb/smsTemplate/queryPage',
        getDataListIsPage: true
      },
      dataList: [],
      loading: null,
      dataForm: {}
    }
  },
  mounted () {
  },
  components: {
    tableTemplate,
    SetUpdate
  },
  computed: {
  },
  methods: {
    edit (data) {
      this.openDialog('addOrUpdate', data)
    }
  }
}
</script>
<style lang="scss" scoped></style>
